<template>
  <div class="custom-table container-fluid" v-loading="loading">
    <AnnouncementsListItem
      v-for="annc in announcements"
      :key="annc.id"
      :announcement="annc"
      @deleted="deletedAnnouncements"
    />
  </div>
</template>

<script>
import AnnouncementsListItem from './list-item';

export default {
  name: 'AnnouncementsList',
  components: { AnnouncementsListItem },
  props: {
    announcements: {
      type: Array,
      required: true,
    },
    loading: {
      type: Boolean,
    },
  },
  methods: {
    deletedAnnouncements(announcement) {
      this.announcements.splice(this.announcements.indexOf(announcement), 1);
    },
  },
};
</script>

<style></style>
